<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>精美股票数据表格</title>
    <link rel="stylesheet" href="stock-table.css">
</head>
<body>

<h2 style="text-align: center; margin: 30px 0; color: #2c3e50;">券商最新研报推荐上市公司一览</h2>
<div class="table-container">
    <table id="stockTable">
        <thead>
            <tr>
                <th>序号</th>
                <th>股票代码</th>
                <th>股票名称</th>
                <th>股票价格</th>
                <th>市盈率TTM</th>
                <th>机构推荐次数</th>
                <th>更新日期</th>
            </tr>
        </thead>
        <tbody id="stockTableBody">
            <!-- 动态数据将在这里插入 -->
        </tbody>
    </table>

    <!-- 分页控件 -->
    <div style="display: flex; justify-content: center; margin-top: 20px; gap: 10px;">
        <button id="prevPage" style="padding: 8px 16px; background: #2c3e50; color: white; border: none; border-radius: 4px; cursor: pointer;">上一页</button>
        <span id="pageInfo" style="padding: 8px 16px;">第1页</span>
        <button id="nextPage" style="padding: 8px 16px; background: #2c3e50; color: white; border: none; border-radius: 4px; cursor: pointer;">下一页</button>
    </div>
</div>

<script src="stock-table.js"></script>

</body>
</html>